﻿<div class="row" ng-controller="calculator" ng-init="initCalc(type)">
    <div class="col-sm-4 ">
        <div class="panel panel-danger">
            <div class="panel-body">
                <div class="form-group">
                    <label class="text-center col-xs-12">Select {{display}} Port</label>
                    <div class="col-xs-10 nopadding">
                        <select size="6" class="form-control" style="height: 100px;" tabindex="-1" ng-keydown="changeSelectionPort($event, 'must')"
                                ng-model="temp.selected" ng-change="UpdateSelected();hasError=false; radio=data[getParent()].FinalCalculationOption;calcCondition(data[getParent()], data);">
                            <option title="Port name: {{i.Name}}&#10;Sequence number: {{i.Sequence}}&#10;{{getCondition(data[$index]) != 0 && 'This port has completed loading/discharge' || ''}}" ng-repeat="i in data" ng-class="{'yellowStatus' : getCondition(data[$index]) != 0 }">{{i.Name}}</option>
                        </select>
                    </div>
                    <div class="col-xs-2 nopadding">
                        <button type="button" class="btn btn-default" tabindex="-1"
                                ng-click="decreaseSelectedValue();calcCondition(data[getParent()],data);"
                                style="height: 40px;" ng-keydown="changeSelectionPort($event, 'must')">
                            <i class="fa fa-long-arrow-up fa-lg"></i>
                        </button>
                    </div>
                    <div class="col-xs-2 nopadding">
                        <button type="button" class="btn btn-default" tabindex="-1"
                                ng-click="increaseSelectedValue();calcCondition(data[getParent()],data);"
                                style="height: 40px;" ng-keydown="changeSelectionPort($event, 'must')">
                            <i class="fa fa-long-arrow-down fa-lg"></i>
                        </button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-xs-12">
                        <button type="button" ng-click="condition=createPort(); radio=0;calcCondition(data[getParent()],data);" tabindex="-1"
                            class="btn btn-default form-control" ng-keydown="changeSelectionPort($event, 'must')">
                            Create port
                        </button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-xs-12">
                        <button type="button" ng-click="deletedName = temp.selected; delPortWindow.open().center()" ng-disabled="data.length == 0" tabindex="-1"
                                class=" btn btn-default form-control" ng-keydown="changeSelectionPort($event, 'must')">
                            Delete port
                        </button>
                    </div> 
                </div>
                <div class="form-group">
                    <div class="col-xs-12 nopadding">
                        <textarea class="form-control" tabindex="100" style="max-width:100%" ng-model="temp.notes" ng-blur="changeNotes(temp.notes)" ng-change="data[getParent()].Notes=temp.notes;changed();"
                            rows="4" ng-disabled="data.length == 0"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <div class="text-center">
            <div ng-show="condition==0">
                <div ng-controller="commonCalculator" ng-init="init(type,getId(), true)"></div>
                <p><strong>No values for any demurrage calculation was selected</strong></p>
            </div>
            <div ng-show="condition==1">
                <p><strong>NOR+6 scenario</strong></p>
                <p>({{calculations.HDETD}} - NOR+6h) - ({{calculations.Case}} - Anchor aweigh) = {{toFixed(calculations.TotalTime)}} hours</p>
                <p>Total time used: {{toFixed(calculations.TotalTime)}} hours</p>
            </div>
            <div ng-show="condition==2">
                <p><strong>NOR+6 scenario</strong></p>
                <p>({{calculations.HDETD}} - ATB) = {{toFixed(calculations.HDATB)}} hours</p>
                <p>Total time used: {{toFixed(calculations.TotalTime)}} hours</p>
            </div>
            <div ng-show="condition==4 || condition==5">
                <p><strong>NOR scenario</strong></p>
                Final Calculation:
                <p>
                    <div class="radio col-sm-offset-1 text-left">
                        <label>
                            <input type="radio" ng-model="radio" ng-init="radio=data[getParent()].FinalCalculationOption" tabindex="-1"
                                   ng-change="data[getParent()].FinalCalculationOption=radio;calcCondition(data[getParent()], data);" value="0" />
                            Option 1: {{calculations.HDETD}} - {{calculations.Case}}
                        </label>
                    </div>
                    <div class="radio col-sm-offset-1 text-left">
                        <label>
                            <input type="radio" ng-model="radio" tabindex="-1"
                                   ng-change="data[getParent()].FinalCalculationOption=radio;calcCondition(data[getParent()], data);" value="1" />
                            Option 2: {{calculations.HDETD}} - NOR
                        </label>
                    </div>
                </p>
                <p>({{calculations.HDETD}} - {{calculations.Word}}) = {{toFixed(calculations.CaseFour)}} hours</p>
                <p>Less Shifting: {{toFixed(calculations.LessShifting)}} hours</p>
                <p>Total time used: {{toFixed(calculations.TotalTime)}} hours</p>
            </div>
            <div style="visibility:hidden; height:1px; overflow:hidden">
                <div kendo-window="delPortWindow" k-title="'Delete confirmation'" k-visible="false" k-resizable="false" k-modal="true"
                     k-on-open="delPortWindowvisible = true" k-on-close="delPortWindowvisible = false">
                    <div class="modal-body">
                        <p>Are you shure you want to delete {{deletedName}} port from the list?</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" ng-click="deletePort(); calcCondition(data[getParent()],data); radio=data[getParent()].FinalCalculationOption;
                                                 message='';delPortWindow.close();" class=" btn btn-default"> Yes
                        </button>
                        <button type="button" ng-click="delPortWindow.close()" class=" btn btn-default">No</button>
                    </div>
                </div>
                <div id="windowsUserName">@User.Identity.Name</div>
            </div>
        </div>
    </div>
    <div class="col-sm-8">
        @Html.Partial("_portsZones")
        <div class="form-group">
            <div class="col-xs-12">
                <div class="form-control portsChat" ng-disabled="data.length == 0" id="{{'Chat'+type+getId()}}" ng-controller="dateValidator">
                    <div ng-repeat="i in data[getParent()].Chat">
                        <blockquote>
                            <footer>{{i.SenderName}} [{{getDateTimeString(i.Time)}}]:</footer>
                            <p ng-init="chatScroll($index)">{{i.Message}}</p>
                        </blockquote>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-xs-12">
                <textarea class="form-control" style="max-width:100%" ng-init="message=''" tabindex="100" ng-model="message" rows="2" ng-disabled="data.length == 0"></textarea>
            </div>
        </div>
        <div class="form-group">
            <div class="col-xs-12">
                <button type="button" class="btn btn-default form-control" ng-click="addToChat(message);message=''" tabindex="100" ng-keydown="changeSelectionPort($event)" ng-disabled="data.length == 0">
                    Add
                </button>
            </div>
        </div>
    </div>
</div>
